<template>
  <div>
    <Modal v-model="showModal" :title="title" @on-ok="ok" @on-cancel="cancel">
      <p v-html="text"></p>
    </Modal>
  </div>
</template>
<script>
  export default {
    name: 'modal',
    data () {
      return {
        showModal: false,
        title: '提示',
        text: '',
        okCallback: null,
        cancelCallback: null
      }
    },
    methods: {
      create (text, ok = null, cancel = null, title = '提示') {
        this.showModal = true
        if (cancel === null) {
        }
        this.text = text
        this.okCallback = ok
        this.cancelCallback = cancel
        this.title = title
      },
      ok () {
        if (this.okCallback !== null) {
          this.okCallback()
        }
      },
      cancel () {
        if (this.cancelCallback !== null) {
          this.cancelCallback()
        }
      }
    }
  }
</script>
